<%@page import="java.util.ArrayList"%>
<%@page import="classes.product"%>
<%@page import="java.util.List"%>
<%@page import="classes.comment"%>
<%@page import="classes.AdminDB"%>

<%@ page contentType="text/html; charset=UTF-8" language="java" import="java.sql.*" errorPage="error.jsp" %>
<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Product</title>
        

        <link href="shopStyles.css" rel="stylesheet" type="text/css"> <!-- guardamos el css en la raiz porque sino hay cosas que no funcionan -->
        <link href="SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css">
        <link rel="stylesheet" type="text/css" href="css/style2.css" />



        <!-- Coloca esta petición de presentación donde creas oportuno. -->
        <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>

        <script type="text/javascript">
            (function() {
                var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
                po.src = 'https://apis.google.com/js/plusone.js';
                var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
            })();
        </script>


        <script language="javascript" type="text/javascript" src="js/jquery.js"></script>
        <script language="javascript" type="text/javascript" src="js/jquery.easing.js"></script>
        <script language="javascript" type="text/javascript" src="js/script.js"></script>


        <!-- shopingcart -->
        <script language="javascript" type="text/javascript" src="js/addCart.js"></script>
        <!-- end -->

        <!-- Pop out photo-->
        <script language="JavaScript">
            function Abrir_ventana (pagina) {
                var opciones="toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=yes, width=508, height=200, top=85, left=140";
                window.open(pagina,"",opciones);
            }

            function about()
            {
                alert("Aplicacion realizada por:\nAlvaro Garcia Ojea\n5º Ingenieria informatica.\n\nEmail: alvarogarcia9@gmail.com");
            }
        </script>


        <style>

            ul.lof-main-wapper li {
                position:relative;	
            }
        </style>

    </head>

    <body>
        <div id="fb-root"></div>
        <script>
            (function(d, s, id) {
                var js, fjs = d.getElementsByTagName(s)[0];
                if (d.getElementById(id)) return;
                js = d.createElement(s); js.id = id;
                js.src = "//connect.facebook.net/es_ES/all.js#xfbml=1";
                fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));

        </script>
        <div class="container">
            <div class="header">
                <table width="100%" border="0">
                    <tr>
                        <td><img src="images/logoshop2.png" width="410" height="165" alt="shop"></td>
                        <td align="right"><img src="images/flag copia.png" width="149" height="123" alt="yourf1store">
                            <!-- Boton me gusta de facebook -->
                            <div class="fb-like" data-send="true" data-layout="button_count" data-width="100" data-show-faces="true"></div>

                            <%-- IDENTIFIACION DE USUARIO CON SESIONES O COOKIES --%>

                            <%@ page language="java" %>
                            <%
                                String cookieName = "email";
                                Cookie cookies[] = request.getCookies();
                                Cookie email = null;
                                if (cookies != null) {
                                    for (int i = 0; i < cookies.length; i++) {
                                        if (cookies[i].getName().equals(cookieName)) {
                                            email = cookies[i];
                                            break;
                                        }
                                    }
                                }
                            %>      


                            <!-- SiteSearch Google -->
                            <FORM method="get" action="http://www.google.com/search">
                                <input type=hidden name=ie value=UTF-8>
                                <input type=hidden name=oe value=UTF-8>
                                <TABLE bgcolor="#F27405" class="borderSearchRightDown"><tr>
                                        <td class="borderSearchRightDown">
                                            <INPUT TYPE="search" name="q" size="31" maxlength="255" value="" placeholder="Search something you want...">
                                            <INPUT type="submit" name="btnG" VALUE="Buscar en sitio">
                                            <font size=-1>
                                            <input type="hidden" name="domains" value="index.jsp"><br><input type="radio" name="sitesearch" value=""> 
                                            <span class="fontSpecial">WWW</span>
                                            <input type="radio" name="sitesearch" value="index.jsp" checked>
                                            <span class="fontSpecial">F1 store</span><br>
                                            </font>

                                        </td></tr></TABLE>
                                <div align="right">

                                    <!-- Reconocimiento de usuario -->


                                    <label><strong><%if (email != null) {%><%=email.getValue()%></strong> | <a href="javascript:Abrir_ventana('logout_popup.jsp')"><font size="1" face="Verdana">logout</font></a> </label>
                                    <label> | <a href="options.jsp"><font size="1" face="Verdana">options</font></a></label> 
                                            <%} else {

                                            %>
                                    <label><strong> Unknown user |</strong></label> <a href="login.jsp">Login</a>
                                    <%}%>

                                    <!-- Fin reconocimiento del usuario --> 



                                    <img src="images/eng.gif" width="20" height="15" alt="eng">   
                                    <img src="images/esp.gif" width="20" height="15" alt="esp"> 
                                    <img src="images/fra.gif" width="20" height="15" alt="fra"> 
                                    <img src="images/ger.gif" width="20" height="15"> 
                                    <img src="images/por.gif" width="20" height="15" alt="por"> 
                                    <a href="#final" class="fontSpecialLanguageChooser"><font size="1" face="Verdana">Choose language</font></a></div>

                            </FORM>
                    </tr>
                </table>
            </div>
        </div>


        <div class="container">
            <div class="header">
                <div align="center">
                    <ul class="menu">    
                        <li><a href="index.jsp" class="active"><span>Home</span></a></li>
                        <% if (email == null) {
                        %>

                        <li><a href="login.jsp"><span>Login</span></a></li>
                        <li><a href="signup.jsp"><span>Signup</span></a></li>

                        <%} else {%>
                        <li><a href="logout_popup.jsp"><span>Logout</span></a></li>
                        <li><a href="options.jsp"><span>Options</span></a></li>

                        <%}%>       
                        <li onClick="about()"><a href="#"><span>About</span></a></li>
                        <li><a href="contact.jsp"><span>Contact</span></a></li>
                        <li><a href="cars.jsp"><span>Cars</span></a></li>
                        <li><a href="apparel.jsp"><span>Apparel</span></a></li>
                        <li><a href="gadgets.jsp"><span>Gadgets</span></a></li>
                        <li><a href="CarAccessories.jsp"><span>Car Accesories</span></a></li>
                        <li><a href="search.jsp"><span>Search</span></a></li>
                        <li><a href="Scart.jsp"><span>Cart</span></a>  </li>
                    </ul>
                </div>
            </div>
        </div>

        <div class="container">
            <div class="content">
                
                <%
                                String id = request.getParameter("id");
                                String team = request.getParameter("team");
                                String name = request.getParameter("name");
                                String description = request.getParameter("description");
                                String stock = request.getParameter("stock");
                                String price = request.getParameter("price");
                                String purchasedtimes = request.getParameter("purchasedtimes");
                                String dir = request.getParameter("dir");
                    if (team == null) {%>
                    Nothing to show
                                <%} else {
                %>
                
                
                <table width="100%" border="0">
                    <tr>
                        <th width="21%" scope="col">&nbsp;</th>
                        <th width="60%" scope="col"><h1><strong><%=name%></strong></h1></th>
                    <th width="19%" scope="col">&nbsp;</th>
                    </tr>
                    <tr>
                        <td>&nbsp;</td>
                        <td>
                            <strong><a href="javascript:Abrir_ventana('<%=dir%>')"><img src="<%=dir%>" alt="<%=name%>" width="359" height="227" class="borderImages"></a>
                            </strong>
                            <form name="order">
                                <p>
                                    <strong>
                                        <input onClick="add(this.form)" type="button" id="boton" value="Add">
                                        <input maxlength=2 id="inputs" size="2" value="1" name="quantity">
                                        <input type="hidden" value="<%=price%>" name="price">
                                        <input type="hidden" value="<%=name%>" name="product"> 
                                        <input type="hidden" value="<%=id%>" name="ref">
                                        <input type="hidden" value="<%=stock%>" name="stock">
                                    </strong></p>
                            </form>
                            <p><strong>Name: </strong> <%=name%></p>
                            <p><strong>Id: </strong> <%=id%></p>
                            <p><strong>Description: </strong> <%=description%></p>
                            <p><strong>Price: </strong> <%=price%> €</p>
                            <p><strong>Stock: </strong> <%=stock%></p>
                          <p><strong>Purchased times: </strong> <%=purchasedtimes%></p>
                          <strong>

                          </strong>
                            <hr>
                            <p align="justify">&nbsp;</p>
                          <p align="justify">&nbsp;</p>
                            <hr>    
                        </td>
                        <td>

                        </td>
                    </tr>
                    <tr>
                        <td>&nbsp;</td>
                        <td><h3><p align="center">&nbsp;</p>
                                <p align="center"><strong><%=name%> - User Comments</strong></p>
                            </h3>
                            <table width="99%" align="center" class="borderContentBestSellers">
                                <tr>
                                    <td width="90%" align="center">

                                        <form name="signup" method="post" action="/ShopOnline/comment_process1">
                                            <div align="center">
                                                <table width="50%" border="0">
                                                    <tr>
                                                        <td><div align="right"><strong><span class="fontSpecial">Name/Email</span></strong></div></td>
                                                        <td><strong><span class="fontSpecial">
                                                                    <input type="text" name="name" id="name" placeholder="Your name/email" required>
                                                                </span></strong></td>
                                                    </tr>
                                                    <tr>
                                                        <td><div align="right">
                                                            </div><span class="fontSpecial">
                                                                <label for="comment">
                                                                    <span class="fontSpecial">

                                                                        <div align="right">Comment:</div>
                                                                </label>
                                                        </td>
                                                        <td><strong><span class="fontSpecial">
                                                                    <textarea class="enterComment" name="comment" cols="30" rows="5" id="comment" placeholder="Your comment please!" required="required"></textarea>
                                                                </span></strong></td>
                                                    </tr>
                                                </table>
                                                <p>
                                                    <strong>
                                                        <input type="submit" name="login" id="login" value="Send">
                                                        <input type="hidden" name="product" value="<%=name%>">
                                                    </strong></p>
                                            </div>
                                        </form>

                                    </td>
                                </tr>
                                <tr>
                                    <td><div align="center">
                                            <strong>
                                                <%
                                                    comment com = new comment();
                                                    List<comment> comentarios = null;
                                                    AdminDB adb = new AdminDB();



                                                    comentarios = com.getAllComentarios(adb.getConnection(), name);

                                                    if (comentarios == null) {%>
                                            </strong></div>

                                        <label> 

                                            <div align="center"><strong>There aren't comments! </strong></div>
                                            <strong>
                                        </label>
                                        </strong>
                                        <div align="center">
                                            <strong>
                                                <%} else {
                                                for (comment cl : comentarios) {%>
                                            </strong>
                                            <table width="373">
                                                <tr>
                                                    <td width="173"><div align="left"><strong><%=cl.getName()%> says:</strong></div></td>
                                                </tr>
                                                <tr>
                                                    <td width="173"><div align="left"><%=cl.getComment()%></div></td>
                                                </tr>
                                                <tr>
                                                    <td>&nbsp;</td>
                                                </tr>
                                            </table>
                                            <strong>
                                                <%}
                                                }%>
                                            </strong></div></td>

                                </tr>    

                            </table></td>
                                                            <%
                                }%>
                        <td>&nbsp;</td>
                    </tr>
                </table>
            </div>
            <p>&nbsp;</p>
        </div>

        <div class="container">
            <div class="footer">
                <h5 align="center" class="white">Alvaro F1 online shop - Your F1 store</h5>
                <a name="final"></a><!-- Marcador para ir al final de la pagina -->
                <div id="google_translate_element" align="center"></div>
                <div align="center">
                    <script>
                        function googleTranslateElementInit() {
                            new google.translate.TranslateElement({
                                pageLanguage: 'es'
                            }, 'google_translate_element');
                        }
                    </script>
                    <script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
                    <img src="images/footerShop.png" width="940" height="74" alt="footer"></div>
            </div>
        </div>

    </body>
</html>